<template>
	<view class="good-item">
		<image  class="image" :src="showImage" alt="" @click="itemClick" />

		<text class="text" >{{ goodsItem.title }}</text>

		<view class="good-info">
			<span class='span' >{{ parseFloat(goodsItem.price) }}¥</span>
			<image class="image" src="../../../static/img/common/collect.svg" alt="" />
			<span class='span' >{{ goodsItem.cfav }}</span>
		</view>
	</view>
</template>

<script>
	import {
		debounce
	} from "common/utils";

	export default {
		name: "GoodListItem",
		props: {
			goodsItem: {
				type: Object,
				default () {
					return null;
				},
			},
		},
		data() {
			return {
				queryId: null
			};
		},
		computed: {
			showImage() {
				return (
					this.goodsItem.image || this.goodsItem.img || this.goodsItem.show.img
				);
			},

			id() {
				return this.goodsItem.iid;
			},
		},
		methods: {
			//转到对应的页面
			itemClick() {
				let page = getCurrentPages()[getCurrentPages().length - 1];

				if (page.route.includes('Detail')) {
					// #ifdef H5
					let id = page.$route.query.id;
					// #endif
					// #ifdef MP-WEIXIN || APP
					let id = uni.getStorageSync('params').id;
					// #endif

					let goodIds = uni.getStorageSync('goodIds');
					if (goodIds) {
						goodIds.push(id);
						uni.setStorageSync('goodIds', goodIds);
					} else {
						goodIds = [id];
						uni.setStorageSync('goodIds', goodIds);
					}
					console.log('goodIds', goodIds);
					uni.redirectTo({
						url: `/pages/detail/Detail?id=${this.id}`,
					})
				} else {
					uni.setStorageSync('goodIds', []);
					uni.navigateTo({
						url: `/pages/detail/Detail?id=${this.id}`,
					})
				}
			},

		},
	};
</script>
<style lang="scss" scoped>
	.good-item {
		padding: 10rpx 0;
		width: 100%;
	}

	.good-item .image {
		width: 100%;
		border-radius: 10rpx;
	}

	.good-item .text {
		display: block;
		font-size: 2vh;
		text-align: center;
		margin: 4rpx 0 6rpx;
	}

	.good-info {
		font-size: 2vh;

		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.good-info .span:nth-child(1) {
		color: deeppink;
		margin-right: 20rpx;
	}

	.good-info > .image {
		width: 2vh;
		height: 2vh;
	}

	.good-price {
		display: flex;
		align-items: center;
	}
</style>
